/*
*******************************************************************************************************
# オーソリティコンテンツ共通スタイル - compiled from authority.scss
*******************************************************************************************************
*/

// オーソリティコンテンツ・SEOコンテンツ
//
// #### export to authority.css
// ※このページでは表示が完全に再現されず、部分的に崩れている場合があります。  
// ※class名やデザインの参考まで
//
// Styleguide 11.0

// /* --------------------------------------------------
//		import core
// -------------------------------------------------- */
// compassのコア機能
@import "core";

// 1カラム→エリア・路線検索など
//
// .mod_box_authority_btm - サンプル
//
// Markup:
// <section class="mod_box_authority_btm">
// <h2 class="ttl_authority">近隣エリアから探す</h2>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li><a href="#dummy">東京</a></li>
// <li>神奈川</li>
// <li><a href="#dummy">群馬</a></li>
// </ul>
// </div>
// <!-- /.mod_box_authority_btm --></section>
//
// Styleguide 11.1

// 2カラム→エリア・路線検索など
//
// .box_authority_column - サンプル
//
// Markup:
// <div class="box_authority_column">
// <section class="mod_box_authority_btm fl">
// <h2 class="ttl_authority">タイプから探す</h2>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li>賃貸マンション</li>
// <li><a href="#dummy">賃貸アパート</a></li>
// <li><a href="#dummy">戸建て・テラスハウス</a></li>
// </ul>
// </div>
// <!-- /.mod_box_authority_btm --></section>
// <section class="mod_box_authority_btm fr">
// <h2 class="ttl_authority">こだわりから探す</h2>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li><a href="#dummy">新築</a></li>
// <li>ペット可</li>
// <li><a href="#dummy">保証人不要</a></li>
// </ul>
// </div>
// <!-- /.mod_box_authority_btm --></section>
// </div>
//
// Styleguide 11.2

// 2カラム：2要素
//
// .box_authority_column - sampl
//
// Markup:
// <div class="box_authority_column">
// <section class="mod_box_authority_btm fl">
// <div>
// <h2 class="ttl_authority">タイプから探す<span class="note">神奈川の賃貸情報を建物タイプから探したい方はこちら</span></h2>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li>賃貸マンション</li>
// <li><a href="#dummy">賃貸アパート</a></li>
// <li><a href="#dummy">戸建て・テラスハウス</a></li>
// </ul>
// </div>
// </div>
// <div class="mt20">
// <p class="ttl_authority"><span class="note">横浜の賃貸情報を建物タイプから探したい方はこちら</span></p>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li>賃貸マンション</li>
// <li><a href="#dummy">賃貸アパート</a></li>
// <li><a href="#dummy">戸建て・テラスハウス</a></li>
// </ul>
// </div>
// </div>
// <!-- /.mod_box_authority_btm --></section>
// <section class="mod_box_authority_btm fr">
// <div>
// <h2 class="ttl_authority">こだわりから探す<span class="note">神奈川の賃貸で人気のこだわり条件から探したい方はこちら</span></h2>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li><a href="#dummy">新築</a></li>
// <li>ペット可</li>
// <li><a href="#dummy">保証人不要</a></li>
// </ul>
// </div>
// </div>
// <div class="mt20">
// <p class="ttl_authority"><span class="note">横浜の賃貸で人気のこだわり条件から探したい方はこちら</span></p>
// <div class="mod_box_section">
// <ul class="list_authority">
// <li><a href="#dummy">新築</a></li>
// <li>ペット可</li>
// <li><a href="#dummy">保証人不要</a></li>
// </ul>
// </div>
// </div>
// <!-- /.mod_box_authority_btm --></section>
// </div>
//
// Styleguide 11.3

// 新着物件→エリア・路線検索など
//
// グレー枠の各高さはjsで揃える
//
// .mod_box_authority_btm .list_new - サンプル
//
// Markup:
// <section class="mod_box_authority_btm">
// <h2 class="ttl_authority">新着物件</h2>
// <div class="mod_box_section">
// <ul class="list_new">
// <li>
// <a href="#dummy">
// <p class="pic"><span><img src="/shared/images/dummy/pic_aut01.jpg" alt="物件画像" /></span></p>
// <p class="txt">京都市東山区三条通南浦二筋目白川筋西入2丁目</p>
// </a></li>
// <li>
// <a href="#dummy">
// <p class="pic"><span><img src="/shared/images/dummy/pic_aut02.jpg" alt="物件画像" /></span></p>
// <p class="txt">中央区京橋1丁目</p>
// </a></li>
// </ul>
// </div>
// <!-- /.mod_box_authority_btm --></section>
//
// Styleguide 11.4

// ページ上部へ戻る→エリア・路線検索など
//
// .btn_pagetop_authority - sample
//
// Markup:
// <p class="btn_pagetop_authority"><a href="#pagetop" class="mod_link_txt">▲<strong>神奈川の路線・駅から探す</strong> ページ上部へ戻る</a></p>
//
// Styleguide 11.5

// 説明文→エリア・路線検索など
//
// .box_ttl_page .lead - sample
//
// Markup:
// <div class="mod_box_head_search_list box_head_search_area">
// <div class="box_ttl_page">
// <h1 class="mod_ttl_page"><strong>神奈川</strong>の賃貸物件を地域から探す</h1>
// <p class="lead">神奈川県は、関東地方の南西部に位置する県で、元の相模国全域と武蔵国の一部に当たる。</p>
// </div>
// </div>
//
// Styleguide 11.6

/* ------------------------------------
	* mod_box_authority_top
* ------------------------------------ */
.mod_box_authority_top {
	position: relative;

	.mod_box_section {
		display: none;
		margin-bottom: 30px;
		padding: 20px;
		line-height: 1.75;
	}
}

/* ------------------------------------
	* mod_box_authority_btm
* ------------------------------------ */
#authorityStation {
	display: none;
}

.mod_box_authority_btm {
	position: relative;
	margin-top: 30px;

	.ttl_authority {
		padding: 0 20px;
		font-size: 20px;
		font-weight: bold;

		.note {
			display: block;
			margin-top: 8px;
			font-size: $fontSizeS;
			font-weight: normal;
		}
	}

	.mod_box_section {
		margin-top: 10px;
		padding: 20px;
	}

	.list_authority {
		position: relative;
		margin-top: -12px;
		padding-bottom: 2px;
		@include clearfix;

		li {
			float: left;
			margin-top: 12px;
			margin-right: 1em;
			word-break: keep-all;
		}

		a {
			@include modLinkTxt;
		}
	}

	.btn_showall {
		margin-top: 20px;
		text-align: right;
	}

	.box_link {
		margin-top: 20px;
		@include clearfix;

		.btn_list {
			float: left;
		}

		.btn_showall {
			float: right;
			margin-top: 0;
			line-height: $lineHeight;
		}
	}

	// 近隣エリア
	.box_neighborhood {
		.list_neighborhood {
			position: relative;
			margin: -20px;

			.child {
				position: relative;
				padding: 10px 20px;
				border-top: 1px solid $bgColorMain;
				@include clearfix;

				&:first-child {
					border-top: none;
				}
			}

			.ttl_line {
				float: left;
				padding: 10px 0;
				padding-right: 28px;
				border-right: 1px solid $bgColorMain;
				width: 240px - 28;

				a {  // モジュール外
					padding-left: 24px;
					@include inline-block;
					@include min-height(17px);
					line-height: $lineHeight;
					background-repeat: no-repeat;
					background-position: 0px 1px;
					background-image: url(#{$imgPathCommon}icon/arr_link_gray.png);
				}
			}

			.box_list {
				position: relative;
				left: -1px;
				float: left;
				padding-left: 30px;
				border-left: 1px solid $bgColorMain;
			}

			.list_authority {
				margin-top: -6px;
				padding: 10px 0;
				width: 418px;
				line-height: $lineHeight;

				li {
					margin-top: 6px;
				}
			}
		}
	}

	// 新着物件
	.list_new {
		$mr: 12px;

		width: 972px;
		margin-right: -$mr;
		@include clearfix;

		li {
			float: left;
			margin-right: $mr;
			border: 1px solid #d0d0d0;
			width: 148px;
			@include border-radius(5px);
		}

		a {
			display: block;
			@include box-sizing(border-box);
			padding: 10px;
			@include modLinkTxt;
		}

		.pic {
			display: table;
			width: 100%;
			margin-bottom: 20px;
			text-align: center;

			span {
				display: table-cell;
				height: 100px;
				vertical-align: middle;
				/* IE7以下 */
				layout-grid-line: 100px;

				@include hack(7) {
					display: block;
				}
				@include hack(6) {
					display: block;
				}
			}
		}

		.txt {
			font-size: $fontSizeS;
			line-height: 1.3;
		}
	}

	// 駅ランキング
	.box_ranking {
		padding: 0;
	}

	.list_ranking {
		@include clearfix;

		li {
			position: relative;
			float: left;
			padding: 15px 12px;
			border-left: 1px solid $bgColorMain;
			@include box-sizing(border-box);
			width: 20%;

			&.row {
				border-bottom: 1px solid $bgColorMain;
			}

			@include hack(7) {
				width: 175px;
			}
			@include hack(6) {
				width: 175px;
			}

			img {
				float: left;
				margin-right: 8px;
			}

			a {
				position: relative;
				top: 3px;
				overflow: hidden;
				line-height: 1.5;
			}
		}
	}
}

/* ------------------------------------
	* box_authority_column
* ------------------------------------ */
.box_authority_column {
	@include clearfix;

	.mod_box_authority_btm {
		margin-top: 10px;
		width: 480px;
	}

	.mod_box_section {
		margin-bottom: 0;
	}
}

/* ------------------------------------
	* btn_pagetop_authority
* ------------------------------------ */
.btn_pagetop_authority {
	margin-top: 20px;
	font-weight: bold;
	text-align: right;
}

/* ------------------------------------
	* 物件一覧（検索結果）：リスト
* ------------------------------------ */
.page_search_result_list {
	.mod_box_authority_top {
		.lead {
			margin-bottom: 16px;
			margin-left: 20px;
		}
	}

	.mod_box_authority_btm {
		.ttl_authority {
			font-size: $fontSizeL;

			.note {
				display: inline;
				margin-top: 0;
				margin-left: 1em;
			}
		}
	}
}

